// 基础样式重置与全局变量
:root {
  // 布局变量
  --app-min-height: 100vh;
  --app-width: 100%;
}

// 全局盒模型设置 - 防止padding影响元素实际宽度
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

// 基础元素样式重置
html,
body {
  height: var(--app-min-height);
  width: var(--app-width);
  overflow-x: hidden; // 防止横向滚动条
  font-family: var(--font-family-base); // 可在variables.scss中定义字体变量
}

// 应用根容器样式
#app {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
}
